import type { ActionType, ProColumns } from '@ant-design/pro-components';
import { PageContainer, ProForm, ProFormTextArea, ProTable } from '@ant-design/pro-components';
import { Button, message, Tag } from 'antd';
import React, { useRef, useState } from 'react';
import { queryOrders } from './service';
import { SearchOutlined } from '@ant-design/icons';



const statusMap = {
  1: {
    color: 'green',
    text: '已跟单',
  },
  0: {
    color: 'red',
    text: '未跟单',
  },
};

const TableList: React.FC = () => {
  const actionRef = useRef<ActionType>();
  const [list,setList] = useState<any>([])
  /**
   * @en-US International configuration
   * @zh-CN 国际化配置
   * */

  const orderStatuses = [
    {
      label: '创建',
      value: 0,
    },
    {
      label: '支付',
      value: 10,
    },
    {
      label: '退款',
      value: 20,
    },
    {
      label: '结算',
      value: 30,
    },
    {
      label: '确认收货',
      value: 40,
    },
  ];
  
  
  const columns: ProColumns<any>[] = [
  
    {
      title: '店铺信息',
      dataIndex: 'storeName',
      copyable: true,
    },
    {
      title: '订单id',
      dataIndex: 'orderId',
      copyable: true,
    },
    {
      title: '订单状态',
      dataIndex: 'orderStatus',
      valueType: 'select',
      request: async () => {
        return orderStatuses;
      },
    },
    {
      title: '跟单状态',
      width: 80,
      dataIndex: 'status',
      valueEnum: statusMap,
     
    },
    {
      title: '下单件数',
      dataIndex: 'itemNum',
      hideInSearch: true,
      
    },
    {
      title: '总付款金额',
      dataIndex: 'totalPayAmount',
      hideInSearch: true,
      render: (_, recod) => {
        return recod.totalPayAmount / 100;
      },
    },

    {
      title: '支付时间',
      dataIndex: 'payTime',
      valueType: 'dateTime',
      hideInSearch: true,
    
    },
    {
      title: '产品',
      dataIndex: 'itemName',
      hideInSearch: true,
    },
    {
      title: '产品ID',
      dataIndex: 'itemId',
      copyable: true,
    },
    {
      title: '退款时间',
      dataIndex: 'refundTime',
      valueType: 'dateTime',
      hideInSearch: true,
    },
    {
      title: '结算时间',
      dataIndex: 'settlementTime',
      valueType: 'dateTime',
      hideInSearch: true,
    },
    {
      title: '收货时间',
      dataIndex: 'receivingTime',
      valueType: 'dateTime',
      hideInSearch: true,
    },
    {
      title: '订单创建时间',
      dataIndex: 'orderCreateTime',
      valueType: 'dateTime',
      hideInSearch: true,
    },
    {
      title: '订单更新时间',
      dataIndex: 'orderUpdateTime',
      valueType: 'dateTime',
      hideInSearch: true,
    }
  ];
  const handleSubmit = async (values: any) => {
    try {
      let orders = values.orders;
      if('\n'.indexOf(orders)) {
        orders = orders.split('\n')
      } else {
        return message.error("订单格式有误~")
      }
      // 这里替换为实际 API 调用
      const rsp = await queryOrders({orders});
      if(rsp.code === "SUCCESS") {
        setList(rsp.data);
        actionRef.current?.reload();
      } else {
        message.error(rsp.msg);
      }
    } catch (error) {
      message.error("订单格式有误~")
    }
  };
  return (
    <PageContainer>
      <ProForm
        layout="horizontal"
        // labelCol={{ span: 6 }}
        // wrapperCol={{ span: 12 }}
        submitter={{
          resetButtonProps: { style: { display: 'none' } },
          submitButtonProps: {
            title: '查询', // 按钮文本
            icon: <SearchOutlined />, // 添加图标
            style: { display: '', marginBottom: '20px' }, // 样式
            type: 'primary', // 按钮类型（primary、default 等）
            size: 'large', // 按钮大小（large、middle、small）
           },
        }}
        onFinish={handleSubmit}
      >
        <ProForm.Group>
          <ProFormTextArea
            name="orders"
            width="lg"
            placeholder="请输入订单号"

          >
          </ProFormTextArea>
          {/* <Button
            type='primary'
            onClick={handleSubmit}
          >查询</Button> */}
        </ProForm.Group>
       
      </ProForm>
      <ProTable<API.RuleListItem, API.PageParams>
        headerTitle='全部订单'
        actionRef={actionRef}
        rowKey="key"
        scroll={{ x: '1000px' }}
        search={false}
        request={async () => {
          return {
            data: list,
            total:list.length,
            success: true
          };
        }}
        columns={columns}
      />
    </PageContainer>
  );
};
export default TableList;
